<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>病床信息管理</title>
  <!-- 引入Tailwind CSS -->
  <script src="https://cdn.tailwindcss.com"></script>
  <!-- 引入Font Awesome图标 -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
  <style>
    /* 自定义样式 */
    :root {
      --primary: #3b82f6;
      --accent: #2563eb;
    }
    .btn {
      display: inline-flex;
      align-items: center;
      padding: 0.75rem 1.5rem;
      background-color: var(--primary);
      color: white;
      border-radius: 0.375rem;
      transition: background-color 0.2s ease;
    }
    .btn:hover {
      background-color: var(--accent);
    }
    .table {
      width: 100%;
      border-collapse: collapse;
      margin-top: 1.5rem;
    }
    .table th,
    .table td {
      padding: 1rem;
      border: 1px solid #e5e7eb;
    }
    .table th {
      background-color: #f3f4f6;
      text-align: left;
    }
    .table-striped tr:nth-child(even) {
      background-color: #f9fafb;
    }
    .edit-link {
      color: var(--primary);
      margin-right: 1rem;
    }
    .edit-link:hover {
      text-decoration: underline;
    }
    .delete-link {
      color: #ef4444;
    }
    .delete-link:hover {
      text-decoration: underline;
    }
  </style>
</head>
<body>
<div class="container mx-auto px-4 py-8 max-w-4xl">
  <h1 class="text-3xl font-bold text-gray-800 mb-4">病床信息管理</h1>
  <a th:href="@{/admin/bed/add}" class="btn">
    <i class="fa fa-plus mr-2"></i> 添加新病床
  </a>

  <!-- 病床表格 -->
  <table class="table table-striped">
    <thead>
    <tr>
      <th>病床ID</th>
      <th>病房号</th>
      <th>床位号</th>
      <th>状态</th>
      <th>患者ID</th>
      <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr th:if="${#lists.isEmpty(beds)}">
      <td colspan="6" class="text-center">暂无病床信息</td>
    </tr>
    <tr th:each="bed : ${beds}">
      <td th:text="${bed.id}">病床ID</td>
      <td th:text="${bed.roomNumber}">病房号</td>
      <td th:text="${bed.bedNumber}">床位号</td>
      <td th:text="${bed.status}">状态</td>
      <td th:text="${bed.patientId} ?: '--'">患者ID</td>
      <td class="text-center">
        <div class="action-links">
          <a th:href="@{/admin/bed/edit/{id}(id=${bed.id})}" class="edit-link" title="编辑">
            <i class="fa fa-pencil" aria-hidden="true"></i> 编辑
          </a>
          <form th:action="@{/admin/bed/delete/{id}(id=${bed.id})}" method="post"
                onsubmit="return confirm('确定要删除该床位吗？')" style="display: inline;">
            <button type="submit" class="text-danger hover:text-danger/80 border-none bg-transparent p-0">
              <i class="fa fa-trash"></i> 删除
            </button>
          </form>
        </div>
      </td>
    </tr>
    </tbody>
  </table>
</div>
</body>
</html>